<template>
  <div class="wholesale-consume">
    <div class="control">
      <h2>创建长期寄售确认消耗单</h2>
    </div>
    <div class="steps">
      <section>
        <el-steps
          :active="active_index - 1"
          process-status="process"
          finish-status="success"
          align-center
          class="component--step"
        >
          <el-step title="选择供应商及医院" class="first">
            <i slot="icon" class="step01"></i>
          </el-step>
          <el-step title="添加消耗产品" class="second">
            <i slot="icon" class="step02"></i>
          </el-step>
          <el-step title="订单信息" class="last">
            <i slot="icon" class="step03"></i>
          </el-step>
        </el-steps>
      </section>
    </div>
    <article v-show="active_index === 1" class="article-box">
      <supplier-and-contract-component
        :supplier-id.sync="form_data.supplier"
        :contract-id.sync="form_data.contract"
        :is-edit="is_edit"
        :is-first-mount.sync="isFirstMount"
        :bus-model="bus_model"
        :order-type="form_data.ordertype"
        :products="form_data.products"
        :product-loading="productLoading"
        :disabled="disabled"
        @change="onSupplierAndContractChange"
      />
    </article>
    <article v-show="active_index === 2">
      <purchase-products-list-component
        :products.sync="form_data.products"
        :option="form_data.option"
        :step-one-form-data="submit_data"
        :product-loading="productLoading"
        @buttonDisable="setButtonDisable"
      />
    </article>
    <article v-show="active_index === 3" class="article-box">
      <carryway-and-address-component
        v-if="showCarrywayAndAddress"
        :carryway-id.sync="form_data.carryway"
        :address-id.sync="form_data.address"
        :total-consumption="form_data.totalconsumption"
        :total-amount="form_data.totalamount"
        :order-type-id.sync="form_data.ordertype"
        :pay-way-id.sync="form_data.payway"
        :is-edit="is_edit"
        :all-data="submit_data"
        :active-index="active_index"
        @change-address="onAddressChanged"
      />
      <div class="block">
        <header>
          <h2>备注信息</h2>
        </header>
        <section>
          <el-input
            v-model="form_data.remark"
            type="textarea"
            :rows="4"
            placeholder="请输入内容"
            maxlength="80"
            show-word-limit
          />
        </section>
        <header>
          <h2>添加消耗依据</h2>
        </header>
        <section>
          <el-button @click="addOtherFileItem">
            <m-iconfont
              classify="m-pc-public"
              icon="m-pc-public_tianj"
              size="14"
            />
            <span>添加附件</span>
          </el-button>
          <div class="copywriting">
            <span
              >可电脑上传文件及图片；也可通过手机扫码上传文件及图片；支持JPG/PNG/PDF格式</span
            >
          </div>
          <el-editable
            :columns="ACCESSORIES_COLUMNS"
            :payload="form_data.other_info.other"
            :height="300"
          >
            <template slot="default-index" slot-scope="scope">
              {{ scope.$index + 1 }}
            </template>
            <template slot="default-ops" slot-scope="scope">
              <el-button type="text" @click="removeCurOtherItem(scope)">
                <span style="color:#ff0000;">删除</span>
              </el-button>
            </template>
            <template slot="default-fileUrl" slot-scope="scope">
              <TableUpload
                :imgname="scope.row.fileName"
                :imgsrc="scope.row.fileUrl"
                :keystr="scope.$index"
                @ReturnImgUrl="returnOtherFileUrl"
              />
            </template>
          </el-editable>
        </section>
      </div>
    </article>
    <el-dialog title="提交订单" :visible.sync="dialogVisible" width="30%">
      <span>确认是否提交订单？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button
          type="primary"
          :disabled="submit_loading"
          :loading="submit_loading"
          @click="onSubmit"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="quantityDialogVisible" width="30%">
      <span v-for="item in form_data.factoryItemNumList" :key="item"
        >产品编码{{ item }}序列号行数或数量不得大于消耗数量<br
      /></span>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="supplierDialogRefuse"
          >知道了</el-button
        >
      </span>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="popBoxPrompt" width="30%">
      <span>暂存的消耗产品被别的订单使用，请订正消耗产品数量</span>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="closePopBoxPrompt">知道了</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script src="./index.js"></script>
<style lang="less" src="./index.less"></style>
